{% load static %}
<!DOCTYPE html>
<html lang='en'>
    <head>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <!-- 上述meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
            integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
        <link href="{% static 'login/css/register.css' %}" rel="stylesheet" />
        <title>注册</title>
    </head>

    <body>
        <div class="container">
            <div class="col">
                <form class="form-register" action="/register/" method="post">
        
                    {% if register_form.captcha.errors %}
                        <div class="alert alert-warning">{{ register_form.captcha.errors }}</div>
                    {% elif message %}
                        <div class="alert alert-warning">{{ message }}</div>
                    {% endif %}
        
                    {% csrf_token %}
                    <h3 class="text-center">欢迎注册</h3>
                    
                    <!-- {{ register_form }} -->
                    
                    <div class="form-group">
                        {{ register_form.username.label_tag }}
                        {{ register_form.username}}
                    </div>
                    <div class="form-group">
                        {{ register_form.password1.label_tag }}
                        {{ register_form.password1 }}
                    </div>
                    <div class="form-group">
                        {{ register_form.password2.label_tag }}
                        {{ register_form.password2 }}
                    </div>
                    <div class="form-group">
                        {{ register_form.email.label_tag }}
                        {{ register_form.email }}
                    </div>
                    <div class="form-group">
                        {{ register_form.sex.label_tag }}
                        {{ register_form.sex }}
                    </div>
                    <div class="form-group">
                        {{ register_form.captcha.label_tag }}
                        {{ register_form.captcha }}
                    </div>
                    
                    <div>
                        <a href="/login/"><ins>直接登录</ins></a>
                        <button type="submit" class="btn btn-primary float-right">注册</button>
                    </div>
                </form>
            </div>
        </div> <!-- /container -->

        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
        <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
            integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
            crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
            integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
            crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
            integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
            crossorigin="anonymous"></script>
    </body>
</html>